<script setup>
import { onBeforeUnmount, onUnmounted,ref } from 'vue';

const title=ref("您好");

// let interval= setInterval(() => {
//   console.log(new Date());
// }, 1000);

//销毁生命周期函数
//应用场景  清除副作用 

 onBeforeUnmount(()=>{
  console.log(title.value);
  console.log("销毁前");
   //清除副作用（如定时器）
    // clearInterval(interval);
 })

 onUnmounted(()=>{
  console.log(title.value);
  console.log('销毁后');
  
 })

</script>

<template>
    <div class="box">子组件
    </div>
</template>

<style scoped>
  .box{
    width: 100%;
    height: 300px;
    background: skyblue;
  }
</style>
